<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@include file="/ui/jsp/includes/includes.jspf"%>
	

<%@include file="/ui/jsp/includes/header.jspf"%>
<div class="hero-unit secondary_container">
    <div id="table-subject-header">
        <c:if test="${!empty facultyResearch.title}">
        	Update Faculty Research
        </c:if>
        <c:if test="${empty facultyResearch.title}">
        	Add New Faculty Research
        </c:if>
    </div>
        <hr>
    
    <div class="row-fluid">

        <form:form method="POST" id="addNewFacultyResearchForm" commandName="facultyResearch"  class="form-horizontal">
            <form:errors path="*" cssClass="errorblock" element="div"/>
            <div class="control-group">
                <label class="control-label" for="facultyName">Faculty Member* </label>
                <div class="controls">
                    <input id="facultyName" type="text" name="facultyName"/>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="categoryName">Category* </label>
                <div class="controls">
                    <input id="categoryName" type="text" name="categoryName"/>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="title">Title* </label>
                <div class="controls">
                    <form:input id="title" path="title"/>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="description">Description</label>
                <div class="controls">
                    <form:input id="description" path="description"/>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="status">Status* </label>
                <div class="controls">
                    <form:input id="status" path="status"/>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="minRequirements">Minimum Requirements</label>
                <div class="controls">
                    <form:input id="minRequirements" path="minRequirements"/>
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="researchUrl">Research URL</label>
                <div class="controls">
                    <form:input id="researchUrl" path="researchUrl"/>
                </div>
            </div>
            <div>*Required Fields</div>
			 <div class="control-group">
                <div class="controls">
				<c:choose>
					<c:when test="${!empty facultyResearch.facultyResearchId}">
						<form:hidden path="facultyResearchId" id="facultyResearchId" />
						<input type="button" onclick="javascript:updateFacultyResearch()"
							value="Submit" class="btn btn-primary" />
					</c:when>
					<c:otherwise>
						<input type="button" onclick="javascript:addNewFacultyResearch()"
							value="Submit" class="btn btn-primary" />
					</c:otherwise>
				</c:choose>
				<input type="button" value="Cancel"
					onclick="javascript:backToFacultyResearchList()"
					class="btn btn-primary" />
			 </div>
            </div>
			<form:hidden id="facultyresearch_faculty" path="faculty.facultyId" />
			<form:hidden id="facultyresearch_category" path="category.categoryId" />
		</form:form>
	</div>
</div>
<%@include file="/ui/jsp/includes/footer.jspf"%>


<script type="text/javascript">
	function addNewFacultyResearch() {
		$('#addNewFacultyResearchForm').attr('action',
				'addNewFacultyResearch.html');
		$('#addNewFacultyResearchForm').submit();
	}
	function updateFacultyResearch() {
		$('#facultyResearchId').val('${facultyResearch.facultyResearchId}');
		$('#addNewFacultyResearchForm').attr('action',
				'updateFacultyResearch.html');
		$('#addNewFacultyResearchForm').submit();
	}
	function backToFacultyResearchList() {
		$('#addNewFacultyResearchForm').attr('action',
				'viewFacultyResearchList.html');
		$('#addNewFacultyResearchForm').submit();
	}

	$(function() {
		var categoryList = '${categoryList}';
		var categoryStr = categoryList.substring(categoryList.indexOf('{') + 1,
				categoryList.indexOf('}'));
		categoryStr = categoryStr.replace(/=/g, ":");
		var categoryArr = categoryStr.split(',');
		var tempArray = new Array();
		var tempStr = "";
		for ( var i = 0; i < categoryArr.length; i++) {
			tempStr = categoryArr[i];
			tempStr = tempStr.substring(tempStr.indexOf(":") + 1);
			tempArray[i] = tempStr;
		}
		$("#categoryName").autocomplete({
			source : tempArray,
			select : function(e, ui) {
				var category = ui.item.value;
				getCatId(category, categoryArr);
				$("#categoryName").val(category);
			},
			close : function(event, ui) {
			}
		});
	});
	function getCatId(str, arr) {
		var key = "";
		var value = "";
		var tempStr = "";
		for ( var i = 0; i < arr.length; i++) {
			tempStr = arr[i];
			tempStr = tempStr.replace(/^\s+|\s+$/g, '');
			key = tempStr.substring(0, tempStr.indexOf(":"));
			value = tempStr.substring(tempStr.indexOf(":") + 1);
			if (value == str) {
				$("#facultyresearch_category").val($.trim(key));
			}

		}
	}
	$(function() {
		var facultyList = '${facultyList}';
		//alert(facultyList);
		var facultyStr = facultyList.substring(facultyList.indexOf('{') + 1,
				facultyList.indexOf('}'));
		facultyStr = facultyStr.replace(/=/g, ":");
		var facultyArr = facultyStr.split(',');
		var tempArray = new Array();
		var tempStr = "";
		for ( var i = 0; i < facultyArr.length; i++) {
			tempStr = facultyArr[i];
			tempStr = tempStr.substring(tempStr.indexOf(":") + 1);
			tempArray[i] = tempStr;
		}
		$("#facultyName").autocomplete({
			source : tempArray,
			select : function(e, ui) {
				//create formatted data
				var faculty = ui.item.value;
				getFacId(faculty, facultyArr);
				$("#facultyName").val($.trim(faculty));
			},
			close : function(event, ui) {
			}
		});

	});
	function getFacId(str, arr) {
		var key = "";
		var value = "";
		var tempStr = "";
		for ( var i = 0; i < arr.length; i++) {
			tempStr = arr[i];
			tempStr = tempStr.replace(/^\s+|\s+$/g, '');
			key = tempStr.substring(0, tempStr.indexOf(":"));
			value = tempStr.substring(tempStr.indexOf(":") + 1);
			if (value == str) {
				$("#facultyresearch_faculty").val($.trim(key));
			}

		}
	}
	
	$(document).ready(function() {
		$("#facultyName").val('${facultyResearch.faculty.fullName}');
		});
	$(document).ready(function() {
		$("#categoryName").val('${facultyResearch.category.categoryName}');
		});
</script>
